import React from 'react'






// 引入组件 

import "./App.css"


// 打开 antd-mobile 的文档
// 安装：yarn add antd-mobile
// 在 App.js 根组件中导入要使用的组件
// 渲染组件
// 在 index.js 中导入组件库样式


import { BrowserRouter as Router, Route, NavLink, Link,Redirect } from 'react-router-dom'

//  引入 homeIndex 和CityList 组件 
import Home from './pages/Home/index'
import CityList from './pages/CityList/index'

//  引入map组件 
import MapIndex from './pages/Map'


// 引入login组件 
import LoginIndex from './pages/Login'




class App extends React.Component {
    render() {
        return (
            <div  className='App'>




                {/*  使用路由 */}

                <Router  className='routerBox'>
                    {/*  路由的入口配置   */}

                    {/* <ul>
                        <li>
                            <NavLink to='/home'> 首页home</NavLink>
                        </li>
                        <li>
                            <NavLink to='/citylist'> 城市选择</NavLink>
                        </li>
                    </ul> */}



                    {/* 路由的出口配置 */}
                    <Route path='/home' component={Home} ></Route>
                    <Route path='/citylist' component={CityList} ></Route>

                    <Route path='/map' component={MapIndex} ></Route>


                   {/*  添加login路由组件 */}
                    <Route path='/login' component={LoginIndex}></Route>


                

                    <Route  path="/"   exact  render={() => <Redirect to="/home" />} />





                </Router>


            </div>
        )
    }
}

export default App








